<!--
 * @Author: your name
 * @Date: 2021-08-12 22:58:25
 * @LastEditTime: 2021-08-13 07:12:17
 * @LastEditors: Please set LastEditors
 * @Description: In User Settings Edit
 * @FilePath: \系统学习\VueProject\vue02\supermall\src\components\common\navbar\NavBar.vue
-->
<template>
    <div class="nav-bar">
       <div class="left"> <slot name="left"></slot></div>
       <div class="center"> <slot  name="center"></slot></div>
       <div class="right"> <slot  name="right"></slot></div>
    </div>
</template>

<script>
export default {
    name:'NavBar'
}
</script>

<style>
    .nav-bar {
        display:flex;
        height: 44px;
        line-height:44px;
        text-align: center;
        box-shadow: 0px 1px 1px rgba(100,100,100,.1);
    }
    .left,.right {
        width:60px;
        /* background:pink; */
    }
    .center{
        flex:1;
        /* background:blue; */
    }
</style>
